<!-- <template>
    <div>
      <el-upload
        v-model:file-list="fileList"
        method="post"
        list-type="picture-card"
        :on-preview="handlePictureCardPreview"
        :on-remove="handleRemove"
      >
        <el-icon><Plus /></el-icon>
        <input type="file" ref="fileInput" style="display: none" multiple @change="handleFileChange" />
      </el-upload>
  
      <el-dialog :visible="dialogVisible" @update:visible="val => dialogVisible = val">
        <img v-if="dialogImageUrl" :src="dialogImageUrl" alt="Preview Image" style="width: 100%" />
      </el-dialog>
    </div>
  </template>
  
  <script setup lang="ts">
  import { ref } from 'vue'
  import { Plus } from '@element-plus/icons-vue'
  import type { UploadProps, UploadUserFile } from 'element-plus'
  
  const fileList = ref<UploadUserFile[]>([
    // ... 初始化一些文件的示例数据
  ])
  
  const props = defineProps({
  handleFileChange: Function // 声明handleFileChange方法作为prop
});
  const dialogImageUrl = ref('')
  const dialogVisible = ref(false)
  
  const handleRemove: UploadProps['onRemove'] = (uploadFile, uploadFiles) => {
    console.log(uploadFile, uploadFiles)
  }
  
  const handlePictureCardPreview: UploadProps['onPreview'] = (uploadFile) => {
    dialogImageUrl.value = uploadFile.url!
    dialogVisible.value = true
  }
  </script>
   -->